<template>
  <view class="content">
    <uni-list>
      <uni-list-item class="font-28" title="当前已养成狗数" :rightText="ruleData.count || 0 + '只'"></uni-list-item>
      <uni-list-item>
        <template v-slot:body>
          <view class="fd">
            <text>置换狗数</text>
            <input v-model="num" placeholder="请输入狗数" />
          </view>
        </template>
      </uni-list-item>
    </uni-list>
    <text class="mar-top"> 1、每次最少置换{{ ruleData.min_num || 0 }}只，最多置换{{ ruleData.mast_num || 0 }}只； </text>
    <text class="mar-top"> 2、每天最多置换{{ ruleData.max_day_times || 0 }}次； </text>
    <text class="mar-top"> 3、每天最多置换{{ ruleData.max_day_num || 0 }}只； </text>
    <text class="mar-top"> 4、每置换{{ ruleData.times_num || 0 }}次后，间隔{{ ruleData.hour_num || 0 }}小时后才能再置换； </text>

    <button @click="onSubmit" type="default">确认置换沐浴露</button>
  </view>
</template>

<script setup lang="ts">
import { ref } from 'vue';
import { onLoad } from '@dcloudio/uni-app';
import { getGoodsLaunchNum, goodsLaunch } from '@/api/bgame';
import { useUserStoreHook } from '@/store/user';
const num: any = ref('');

const ruleData = ref({
  count: 0,
  mast_num: 0,
  min_num: 0,
  max_day_num: 0,
  max_day_times: 0,
  times_num: 0,
  hour_num: 0,
});
const onSubmit = async () => {
  if (!num.value) {
    uni.showToast({
      title: '请输入置换的数量',
      mask: true,
      icon: 'error',
    });
    return;
  }
  if (num.value - ruleData.value.count > 0) {
    uni.showToast({
      title: `最多置换${ruleData.value.count}只`,
      mask: true,
      icon: 'error',
    });
    return;
  }
  if (num.value - ruleData.value.mast_num > 0) {
    uni.showToast({
      title: `每次最多置换${ruleData.value.mast_num}只`,
      mask: true,
      icon: 'error',
    });
    return;
  }
  if (0 < ruleData.value.min_num - num.value) {
    uni.showToast({
      title: `每次最少置换${ruleData.value.min_num}只`,
      mask: true,
      icon: 'error',
    });
    return;
  }

  uni.showLoading({
    title: '置换中...',
    mask: true,
  });
  const res = await goodsLaunch({
    count: num.value,
  });
  uni.hideLoading();
  if (1 == res.result) {
    uni.showToast({
      title: '置换成功',
      icon: 'none',
    });
    getData();
  } else {
    uni.showToast({
      title: res.msg.msg || '置换失败',
      mask: true,
      icon: 'error',
    });
  }
};
const getData = async () => {
  uni.showLoading({
    title: '获取数据中...',
    mask: true,
  });
  const res: any = await getGoodsLaunchNum({});
  uni.hideLoading();

  if (1 == res.result) {
    const { count = 0, mast_num = 0, min_num = 0, max_day_num = 0, max_day_times = 0, times_num = 0, hour_num = 0 } = res.data || {};
    Object.assign(ruleData.value, {
      mast_num,
      min_num,
      max_day_num,
      max_day_times,
      times_num,
      hour_num,
      count,
    });
  }
};
onLoad(async (option) => {
  await useUserStoreHook().getSign();
  getData();
});
</script>

<style lang="scss" scoped>
.content {
  width: 100%;
  height: calc(100vh - 44px);
  padding: 8rpx;
  display: flex;
  flex-direction: column;

  .mar-top {
    margin-top: 30rpx;
  }

  text {
    width: 100%;
    padding: 5rpx;
    margin-top: 5rpx;
  }

  button {
    margin: 30rpx;
    padding: 5rpx;
    color: white;
    background-color: #009900;
  }
}

.fd {
  width: 100%;
  font-size: 28rpx;
  display: flex;
  flex-direction: column;

  input {
    margin-top: 10rpx;
  }
}

.font-28 {
  font-size: 28rpx;
}
</style>
